<template>
  <rx-layout>
    <div slot="center">
      <rx-dialog
        order="button"
        btnalign="right"
        class="dialog"
        @handOk="handleSubmit"
        @cancel="cancel"
      >
          {{i18n('title.area','...内容区域...')}}
        <br />{{i18n('title.cooperate','主要配合弹窗页面使用')}}
        <br />@handOk {{i18n('title.confirm','确定按钮事件')}} Util.closeWindow(this,"ok")
        <br />@cancel {{i18n('title.cancel','取消按钮事件')}} Util.closeWindow(this,"cancel")
      </rx-dialog>
      <div class="tanstly">
        <a-config-provider :auto-insert-space-in-button="false">
          <a-button type="primary" @click.stop="handleTask()">
              {{i18n('title.popover','弹窗')}}
          </a-button>
        </a-config-provider>
      </div>
    </div>
  </rx-layout>
</template>

<script>
import { RxLayout, RxDialog,Util,BaseList} from "@lowcode/jpaas-common-lib"
import Bialog from "./dialog";
export default {
  name: 'dialog',
   mixins: [BaseList],
  comments: {
    RxLayout,
    RxDialog,
  },
  data() {
    return {}
  },
  created() {},
  methods: {
      i18n(name, text, key) {
          return this.$ti18(name, text, "assemblyLang", key);
      },
    handleSubmit: function() {
      alert(this.$ti18('rxForm.ackBtn','确认'))
    },
    cancel: function() {
      alert(this.$ti18('rxForm.cancelBtn','取消'))
    },
    handleTask() {
      Util.open({
        component:Bialog,
        curVm:this,
        widthHeight:['600px','500px'],
        title:'任务处理',
        data:{
            taskId:'11'
          }
        },function (action){
        console.log(action);
      });
    },
  }
}
</script>

<style scoped>
.dialog {
  width: 400px;
  height: 400px;
  float: left;
}
.tanstly {
  margin-left: 50px;
  float: left;
}
</style>